{% extends "base.html" %}

{% block title %}User Profile{% endblock %}
{% block crumb %}&rsaquo; {% if thisUser == request.user %}Your Profile{% else %}User Profile &rsaquo; {{thisUser.username}}{% endif %}{% endblock %}

{% block extrahead %}

<script type="text/javascript" src="/static_media/js/heatmap.js"></script>

{% endblock %}

{% block content %}

{% if thisUser == request.user %}
<div class="profileEdit">
	<img class="left" height=43 src="/static_media/image/notice.png" />
	<p>This is your profile. Would you like to <a href="/userprofile/edit">edit it</a>?</p>
	<p>You can also adjust your <a href="/userprofile/privacy">privacy settings</a> to set who else sees this profile.</p>
</div>
{% endif %}

  <table class="profileTable">
  	<tr>
	      {% if image %}
	      <td>
	      	<img src="{{image.url}}" class="profile">
	      </td>
	      {% endif %}
       <td>
          {% if profile %}
          	<ul class="profileList">
			  {% for item,value in profile %}
			  	{% if item = "Email" %}
			  		<li><span class="bold">{{item}}</span>: <a href="mailto:{{value}}">{{value}}</a></li>
			  	{% else %}{% if item = "Website" %}
			  		<li><span class="bold">{{item}}</span>: <a href="{{value}}">{{value}}</a></li>
			  	{% else %}
					<li><span class="bold">{{item}}</span>: {{value}}</li>
				{% endif %}{% endif %}
			  {%endfor%}
		  	</ul>
		  {% endif %}
	  </td>
	</tr>
  </table>
  {% if comparing_name %}
  <h2>Comparing <span class="red">Your Usage</span> with <span class="blue">{{comparing_name}}</span></h2>
  {% else %}
  <h2>Your Usage Profile</h2>
  {% endif %}
  <br>
  {% include "analytics/heatmap.html" %}
  <br>
{% endblock %}